import React from 'react';
import { Card, Typography, Form, Switch, Select, Button, Divider } from 'antd';

const { Title } = Typography;
const { Option } = Select;

const SettingsPage = () => {
  const [form] = Form.useForm();

  const onFinish = (values) => {
    console.log('保存设置:', values);
  };

  return (
    <div className="settings-page">
      <Title level={2}>设置</Title>
      
      <Card title="处理设置">
        <Form
          form={form}
          layout="vertical"
          onFinish={onFinish}
          initialValues={{
            defaultMode: 'standard',
            autoStart: true,
            notifications: true,
          }}
        >
          <Form.Item
            label="默认处理模式"
            name="defaultMode"
          >
            <Select>
              <Option value="fast">快速模式</Option>
              <Option value="standard">标准模式</Option>
              <Option value="fine">精细模式</Option>
            </Select>
          </Form.Item>

          <Form.Item
            label="自动开始处理"
            name="autoStart"
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>

          <Form.Item
            label="处理完成通知"
            name="notifications"
            valuePropName="checked"
          >
            <Switch />
          </Form.Item>

          <Form.Item>
            <Button type="primary" htmlType="submit">
              保存设置
            </Button>
          </Form.Item>
        </Form>
      </Card>

      <Divider />

      <Card title="账户设置">
        <p>这里可以配置账户相关的设置</p>
        <Button>修改密码</Button>
      </Card>
    </div>
  );
};

export default SettingsPage; 